<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>全选 全不选 反选</title>
	<style type="text/css">

	table{width:500px;height:300px;border-collapse:collapse;text-align:center;}

	</style>
</head>
<body>
	<center>
	<table border='1'>
		<caption><h3>人民艺术家排行榜</h3></caption>
		<tr>
			<td>&nbsp;</td>
			<td>序号</td>
			<td>姓名</td>
			<td>性别</td>
			<td>年龄</td>
			<td>操作</td>	
		</tr>
		<tr>
			<td><input type="checkbox" name='ids[]'></td>
			<td>1</td>
			<td>张舫</td>
			<td>男</td>
			<td>18</td>
			<td><button class='but'>删除</button></td>	
		</tr>
		<tr>
			<td><input type="checkbox" name='ids[]'></td>
			<td>2</td>
			<td>达达</td>
			<td>不详</td>
			<td>19</td>
			<td><button class='but'>删除</button></td>	
		</tr>
		<tr>
			<td><input type="checkbox" name='ids[]'></td>
			<td>3</td>
			<td>苍老师</td>
			<td>女</td>
			<td>20</td>
			<td><button class='but'>删除</button></td>	
		</tr>
		<tr>
			<td><input type="checkbox" name='ids[]'></td>
			<td>4</td>
			<td>小泽</td>
			<td>女</td>
			<td>21</td>
			<td><button class='but'>删除</button></td>	
		</tr>
		<tr>
			<td>&nbsp;</td>
			<td><button id='sel'>全选</button></td>
			<td><button id='nosel'>全不选</button></td>
			<td><button id='fsel'>反选</button></td>
			<td><button id='del'>批量删除</button></td>	
		</tr>
	</table>
	</center>

	<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
	<script type="text/javascript">
	//全选
	$('#sel').click(function(){

		//获取多选框
		//$('input[name="ids[]"]').attr('checked','checked');
		$('input[name="ids[]"]').attr('checked',true);

		//效果:在行内input中添加一个属性: checked ='checked'
	})

	//全不选
	$('#nosel').click(function(){

		//
		$('input[name="ids[]"]').attr('checked',false);
	})

	//反选
	$('#fsel').click(function(){
		$('input[name="ids[]"]').each(function(){
			//获取选中的元素
			//var ch = this.checked;// 对  选中返回true 否则返回false
			 //var ch =$(this).attr('checked'); //如果选中则返回checked 否则返回undefined

			 //var ch =$(this).checked;// 错 返回  undefined
			this.checked = !this.checked; //正确写法
			//判断
		if(ch) {

				//var mn =$(this).attr('checked','false'); 错
				var mn =$(this).attr('checked',false);
			}else {
				//$(this).attr('checked','true'); 错
				$(this).attr('checked',true);
			}             // console.log(ch);

		})
		//var ch = $('input[name="ids[]"]').checked;
		//(错 undefined 由于你获取的$('input[name="ids[]"]')
		//是一个数组,里面含有多个元素,所以需要遍历)
	})	
	//批量删除
	$('#del').click(function(){

		$('input[name="ids[]"]:checked').parents('tr').remove();
	})
	



	//删除单一元素
	$('.but').each(function(){
		//绑定单击事件
		$(this).click(function(){
			//获取第一个input
			var ipu = $(this).parent().siblings().find('input')[0].checked;
			console.log(ipu);

			if(ipu) {
				//删除tr
				$(this).parents('tr').remove();
			}

		})
	})

	



	</script>
</body>
</html>